<template>
  <div class="home">
    <img alt="Vue logo" src="../assets/logo.png" />
    <HelloWorld :msg="say" />
    <button @click="peterSay">say</button>
  </div>
</template>

<script>
// @ is an alias to /src
import HelloWorld from "@/components/HelloWorld.vue";
import { mapState, mapActions, mapMutations  } from 'vuex'
import {CHANGE_NAME} from '../types'

export default {
  name: "home",
  components: {
    HelloWorld
  },
  methods:{
    ...mapActions({
      sayOne:'sayHello'
    }),
    ...mapMutations([CHANGE_NAME]),
    peterSay() {
      this[CHANGE_NAME]({message:'Hello', name:'Peter'})
    }
  },
  computed: mapState(["message","say"])
};
</script>
